import VueRouter from 'vue-router';
import Vue from 'vue';

import Homepage from '../pages/homepage';
import Login from '../pages/login';
import .register {
    width: 100vw;
    height: 100vh;
    background: url('../../assets/img/login.jpg');
    .reg-box {
      width: 450px;
      height: 490px;
      padding: 10px;
      border-radius: 3px;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      h3 {
        display: flex;
        justify-content: center;
        color: #fff;
        letter-spacing: 0.2em;
      }
      .loginBtn {
        width: 100%;
        letter-spacing: 0.5em;
      }
      a {
        display: flex;
        justify-content: center;
        font-size: 16px;
        letter-spacing: 0.1em;
        text-decoration: none;
        color: #fff;
      }
    }
  
  } from '../pages/register';
import Dashboard from '../pages/dashboard';
import Employees from '../pages/employees';
import Structure from '../pages/structure';
// more pages here

Vue.use(VueRouter);

const routes = [
    {
        path: '/',
        component: Homepage,
        children: [
            { path: '/', component: Dashboard },
            { path: '/employees', component: Employees },
            { path: '/structure', component: Structure },
        ],
    },
    { path: '/login', component: Login },
];

export default new VueRouter({ routes });
